<script setup>
import { ElMessage } from 'element-plus';
import { computed, ref } from 'vue';
import ModelSetting from './ModelSetting.vue';
import useAssistantSettingStore from './AssistantStore';
import AssistantSetting from './AssistantSetting.vue';
import { INVALID_ASSISTANT_ID } from '../constants';
import { list_file_meta_by_parsestatus, PARSE_STATUS } from '@/api/file';
import { CODE } from '@/api/constants';

const props = defineProps({
    isVisible: Boolean,
    assistantId: String
})
const emit = defineEmits(['update:isVisible'])
const dialogVisble = computed({
  get: () => props.isVisible,
  set: (val) => {
    emit('update:isVisible', val)
  }
})

const assistantStore = useAssistantSettingStore()

const onOpen = async () => {
    const res = await assistantStore.setAssistantId(props.assistantId)
    if (!res.success) {
        ElMessage({
            message: res.msg,
            type: 'error',
            duration: 3000
        })
    }
    parsed_papers.value = await getParsedPaperFiles()
}
const parsed_papers = ref([])
const getParsedPaperFiles = async () => {
    const resp = await list_file_meta_by_parsestatus({parse_status: PARSE_STATUS.ParseSuccess})
    if (resp.code != CODE.OK) {
        ElMessage({
            message: '获取解析完成的论文数据失败，请重试！',
            type: 'error',
            duration: 3000
        })
    }
    return resp.data.metas
}

const isOkLoading = ref(false)
const okBtnFunc = async () => {
    try {
        isOkLoading.value = true
        let result = null
        if (props.assistantId === INVALID_ASSISTANT_ID) {
            result = await assistantStore.createAssistant()
        } else {
            result = await assistantStore.updateAssistant()
        }
        ElMessage({
            message: result.msg,
            type: result.success ? 'success' : 'error',
            duration: 3000
        })
        dialogVisble.value = !result.success
    } finally {
        isOkLoading.value = false
    }
}
</script>

<template>
    <el-dialog @open="onOpen" v-model="dialogVisble" :close-on-click-modal="false" 
        title="助理设置" width="600" style="padding: 20px;">
        <!-- todo: 添加Tab，tab下添加知识库、引导词设置，模型设置 -->
        <el-tabs type="border-card">
            <el-tab-pane label="助理">
                <AssistantSetting :parsed_papers="parsed_papers"/>
            </el-tab-pane>
            <el-tab-pane label="模型">
                <ModelSetting />
            </el-tab-pane>
        </el-tabs>
        <template #footer>
            <el-button type="default" size="default" @click="dialogVisble = false">取消</el-button>
            <el-button type="primary" size="default" @click="okBtnFunc"
                :loading="isOkLoading" :disabled="assistantStore.isOkBtnDisabled">确定</el-button>
        </template>
    </el-dialog>
</template>

<style scoped>
.card-header {
    display: flex;
    flex-direction: row;
}

.spacer {
    flex-grow: 1;
}

:deep(.el-card__header) {
  background-color: rgb(226, 233, 247);
  padding: 10px 20px; /* 调整header内边距 */
}

.card-body {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.freedom-param-line {
    display: inline-flex;
    flex-direction: row;
    justify-content: flex-end;
    padding: 6px 0px;
}

.factory-select-row {
    display: inline-flex;
    flex-direction: row;
}
</style>